import React from 'react';
// import {
// 	Route,
// 	Link
// } from 'react-router-dom';
import './index.scss';
import { Carousel } from 'antd';
// import ajax from '@/api/public';

class Resource extends React.Component{
	constructor (props) {
		super(props)
		this.state={

		}
	}
	render() {
		return(
			<div className='weidai'>
				<div className='common-head home-contain'>
					<a href='#/resource'>流量资源</a> <i className='glyphicon glyphicon-toright'></i> <span>信息流广告</span>
				</div>
				<div className='common-title' style={{marginBottom: '24px'}}>什么是信息流广告？</div>
				<div className='text-center'>信息流(Feeds)广告，是在社交媒体用户好友动态、或者资讯媒体和视听媒体内容流中的广告。</div>
				<div className='text-title text-center'>您的广告可以展示在这里</div>
				<div className='home-contain' style={{paddingBottom: '35px'}}>
					<div className='home-contain text-contain'>
						<span className='second-title'></span>
						<div className='text-center'>
							<div>
								<div className='mobile-border special-board' style={{display: 'inline-block', position: 'relative'}}>
									<div className='mobile-title text-center'>单图</div>
									<img src={`${process.env.PUBLIC_URL}/images/mobile-border3.png`} width='100' style={{position: 'absolute', left: '0', top: '0'}}/>
									<img src={`${process.env.PUBLIC_URL}/images/组 43.png`} width='90' style={{position: 'absolute', left: '5px', top: '18px'}}/>
								</div>
								<div className='mobile-border special-board' style={{display: 'inline-block', position: 'relative'}}>
									<div className='mobile-title text-center'>大图</div>
									<img src={`${process.env.PUBLIC_URL}/images/mobile-border3.png`} width='100' style={{position: 'absolute', left: '0', top: '0'}}/>
									<img src={`${process.env.PUBLIC_URL}/images/组 45.png`} width='90' style={{position: 'absolute', left: '5px', top: '18px'}}/>
								</div>
								<div className='mobile-border special-board' style={{display: 'inline-block', position: 'relative'}}>
									<div className='mobile-title text-center'>多图</div>
									<img src={`${process.env.PUBLIC_URL}/images/mobile-border3.png`} width='100' style={{position: 'absolute', left: '0', top: '0'}}/>
									<img src={`${process.env.PUBLIC_URL}/images/组 44.png`} width='90' style={{position: 'absolute', left: '5px', top: '18px'}}/>
								</div>
								<div className='mobile-border special-board' style={{display: 'inline-block', position: 'relative'}}>
									<div className='mobile-title text-center'>视频</div>
									<img src={`${process.env.PUBLIC_URL}/images/mobile-border3.png`} width='100' style={{position: 'absolute', left: '0', top: '0'}}/>
									<img src={`${process.env.PUBLIC_URL}/images/组 46.png`} width='90' style={{position: 'absolute', left: '5px', top: '18px'}}/>
								</div>
							</div>
						</div>
						<div className='text-center' style={{marginTop: '30px'}}>
							<div className='pc-border' style={{display: 'inline-block', marginBottom: '30px'}}>
								<div className='pc-title text-center'>图文样式/动图样式</div>
								<div className='pc-img--group'>
									<img src={`${process.env.PUBLIC_URL}/images/pc-border.png`} width='332' style={{position: 'absolute', left: '0', top: '0'}}/>
									<img src={`${process.env.PUBLIC_URL}/images/组 5.png`} style={{position: 'absolute', left: '63px', top: '23px'}}/>
								</div>
								<div className='pc-desc'>
									<span>与新闻浏览器样式打通</span>
									<span>图片支持GIF格式更吸引关注</span>
								</div>
							</div>
							<div className='pc-border' style={{display: 'inline-block', position: 'relative', marginLeft: '37px', marginBottom: '30px'}}>
								<div className='pc-title text-center'>多图样式</div>
								<div className='pc-img--group'>
									<img src={`${process.env.PUBLIC_URL}/images/pc-border.png`} width='332' style={{position: 'absolute', left: '0', top: '0'}}/>
									<img src={`${process.env.PUBLIC_URL}/images/组 4.png`} style={{position: 'absolute', left: '63px', top: '23px'}}/>
								</div>
								<div className='pc-desc'>
									<span>更丰富的展现维度</span>
								</div>
							</div>
							<div className='pc-border' style={{display: 'inline-block'}}>
								<div className='pc-title text-center'>大图样式</div>
								<div className='pc-img--group'>
									<img src={`${process.env.PUBLIC_URL}/images/pc-border.png`} width='332' style={{position: 'absolute', left: '0', top: '0'}}/>
									<img src={`${process.env.PUBLIC_URL}/images/组 41.png`} style={{position: 'absolute', left: '63px', top: '23px'}}/>
								</div>
								<div className='pc-desc'>
									<span>更丰富的展现维度</span>
								</div>
							</div>
							<div className='pc-border' style={{display: 'inline-block', position: 'relative', marginLeft: '37px'}}>
								<div className='pc-title text-center'>视频样式</div>
								<div className='pc-img--group'>
									<img src={`${process.env.PUBLIC_URL}/images/pc-border.png`} width='332' style={{position: 'absolute', left: '0', top: '0'}}/>
									<img src={`${process.env.PUBLIC_URL}/images/组 42.png`} style={{position: 'absolute', left: '63px', top: '23px'}}/>
								</div>
								<div className='pc-desc'>
									<span>更具冲击力的表达方式</span>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		)
	}
}
export default Resource;
